<template>
  <div id="root">
    <button @click="getStudents">获取学生信息</button>
    <button @click="getCars">获取汽车信息</button>
    <button @click="getLocalStudents">获取本地信息</button>
  </div>
</template>

<script>
import axios from 'axios'
export default {
    name:'App',
    methods:{
      getStudents(){
        // axios.get('http://localhost:5000/students').then( 
        // 请求发给代理服务器 http://localhost:8080
        axios.get('http://localhost:8080/test1/students').then(
          //成功的回调
          response => {
            console.log('请求学生信息成功',response.data)
          },
          //失败的回调
          error => {
            console.log('请求学生信息失败',error.message)
          }
        )
      },
      getCars(){
        // 请求发给代理服务器 http://localhost:8080
        axios.get('http://localhost:8080/test2/cars').then(
          //成功的回调
          response => {
            console.log('请求汽车信息成功',response.data)
          },
          //失败的回调
          error => {
            console.log('请求汽车信息失败',error.message)
          }
        )
      },
      //获取本地students文件，不加代理前缀
      getLocalStudents(){
        axios.get('http://localhost:8080/students').then(
          //成功的回调
          response => {
            console.log('请求本地信息成功',response.data)
          },
          //失败的回调
          error => {
            console.log('请求本地信息失败',error.message)
          }
        )
      }
    }
}
</script>
